page {
    background-color: #f5f5f5;
}

.sk {
    display: flex;
    justify-content: center;
    min-height: 100vh;
}

.head_bar {
    position: relative;
    padding: 20rpx 28rpx;
    background-color: #fff;

    .supplier_info {
        display: flex;
        border-radius: 20rpx 20rpx 0 0;

        .head_img {
            flex-shrink: 0;
            width: 116rpx;
            height: 116rpx;
            border-radius: 10rpx;
            overflow: hidden;
        }

        .content {
            flex: 1;
            display: flex;
            flex-direction: column;
            justify-content: center;
            padding: 4rpx 24rpx 4rpx 16rpx;


            .name {
                margin-bottom: 10rpx;
                font-size: 32rpx;
                font-weight: bold;
            }

            .bottom_c {
                display: flex;
                align-items: center;

                .saled {
                    font-size: 24rpx;
                    // color: #fff;
                    opacity: .95;
                }

                .line {
                    margin: 0 16rpx;
                    width: 2rpx;
                    height: 20rpx;
                    background-color: #CDCDCD;
                }
            }

            .location {
                margin-top: 4rpx;
                font-size: 24rpx;
                color: #fff;
                opacity: .95;
            }

            .rate_c {
                display: flex;
                align-items: center;

                .num {
                    padding-left: 4rpx;
                    font-size: 20rpx;
                    color: #ee9c32;
                }
            }
        }

    }

    .right {
        position: absolute;
        right: 28rpx;
        bottom: 20rpx;
        display: flex;

        .like {
            margin-top: 2rpx;
        }

        .nolike_icon {
            width: 43rpx;
            height: 43rpx;
        }

        .liked_icon {
            margin-top: 0;
            width: 48rpx;
            height: 48rpx;
        }

        .share_c {
            margin-left: 30rpx;
            position: relative;

            .mask {
                position: absolute;
                left: 0;
                top: 0;
                width: 100%;
                height: 100%;
                z-index: 2;
            }
        }

        .share {
            font-size: 24rpx;
            line-height: normal !important;
            padding: 0 0 4rpx !important;
            border: none !important;
            height: 100%;

            .icon {
                width: 44rpx;
                height: 44rpx;
            }
        }
    }
}

.van-tab--active {
    font-weight: bold !important;
}

.goods_c {
    padding: 20rpx;

    .cate_screen {
        margin-bottom: 20rpx;
        padding: 0 20rpx;
        background-color: #fff;
        border-radius: 20rpx;
    }

    .good_card {
        display: flex;
        margin-bottom: 20rpx;
        padding: 20rpx;
        background-color: #fff;
        border-radius: 20rpx;

        .image {
            position: relative;
            flex-shrink: 0;
            width: 132rpx;
            height: 132rpx;
            border-radius: 6rpx;
            overflow: hidden;

            .sold_out {
                position: absolute;
                z-index: 1;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                background-color: rgba($color: #000, $alpha: 0.4);
                color: #F6F6F6;
                font-size: 32rpx;
                font-weight: bold;
            }
        }

        .middle {
            flex: 1;
            display: flex;
            flex-direction: column;
            padding: 0 20rpx;

            .name {
                font-size: 32rpx;
                font-weight: 600;
            }

            .row1 {
                margin: 8rpx 0;
                font-size: 24rpx;
                color: var(--themColorGrey);

                .first {
                    margin-right: 20rpx;
                }
            }

            .row2 {
                display: flex;
                font-size: 24rpx;
                color: var(--themColorGrey);

                .saled {
                    margin-right: 20rpx;
                }
            }
        }

        .right {
            flex-shrink: 0;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            align-items: flex-end;

            .price {
                display: flex;
                align-items: baseline;
                color: var(--themColorRed);
                font-size: 32rpx;

                .decoration {
                    margin-left: 4rpx;
                    font-size: 24rpx;
                }

                .old_price {
                    margin-left: 10rpx;
                    font-size: 28rpx;
                    text-decoration: line-through;
                    color: var(--themColorGrey);
                    font-weight: 500;
                }
            }

            .icon {
                width: 40rpx;
                height: 40rpx;
            }
        }
    }
}

.evaluate_c {
    margin-top: 20rpx;
    padding: 28rpx;
    background-color: #fff;

    .screen_c {
        display: flex;
        flex-wrap: wrap;
        padding: 28rpx 0;

        .item {
            padding: 8rpx 16rpx;
            color: #fff;
            font-size: 24rpx;
            border-radius: 8rpx;
            background-color: var(--secondThemeColor);

            .nums {
                margin-left: 6rpx;
                font-size: 22rpx;
                font-weight: 600;
            }

            &+.item {
                margin-left: 20rpx;
            }
        }
    }

    .evaluate_content {
        padding: 20rpx 0 0;
        border-top: 2rpx solid var(--borderColor);

        .user_info_c {
            display: flex;
            align-items: center;

            .face_img {
                flex-shrink: 0;
                width: 44rpx;
                height: 44rpx;
                border-radius: 50%;
                overflow: hidden;
            }

            .name {
                margin: 0 20rpx;
            }

            .issue_date {
                flex: 1;
                text-align: right;
                font-size: 24rpx;
                color: #868686;
            }
        }

        .evaluate_text {
            padding: 20rpx 0;
            line-height: 46rpx;
        }

        .evaluate_image_c {
            .img {
                margin-bottom: 10px;
                width: 100%;
                height: 160rpx;
                border-radius: 10rpx;
                overflow: hidden;
            }
        }
    }

}

.supplier_info {
    padding: 28rpx;

    .panel {
        padding: 10rpx 20rpx;
        border-radius: 20rpx;
        background-color: #fff;
    }

    .item {
        display: flex;
        align-items: baseline;
        padding: 20rpx 0;
        border-bottom: 2rpx solid #f7f7f7;

        &:last-child {
            border-bottom: none;
        }
    }

    .left {
        flex-shrink: 0;
        width: 160rpx;
    }

    .right {
        flex: 1;
        color: #999;
    }

    .pd0 {
        padding-bottom: 0 !important;
    }


    .label_c {
        display: flex;
        flex-wrap: wrap;

        .label {
            flex-shrink: 0;
            margin-right: 14rpx;
            margin-bottom: 20rpx;
            padding: 2rpx 8rpx;
            font-size: 20rpx;
            color: #fff;
            border-radius: 5rpx;

            &:last-child {
                margin-right: 0;
            }
        }
    }

    .introduction_title {
        margin: 30rpx 0 10rpx;
        padding: 10rpx 0;
        background-color: #f5f5f5;
    }

    .introduction_content {
        text-indent: 2em;
        line-height: 42rpx;
    }
}